.search-container {
  display: flex;
  align-items: center;
  justify-content: center; /* 水平居中 */
  gap: 8px;
  margin-bottom: 16px;
  height: 40px;
  margin-top: 1%; /* 设置偏上的位置 */
}
.search-form {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 50%;
}
.search-input {
  padding: 8px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 50px; /* 设置圆角 */
  flex-grow: 1;
  height: 40px; /* 确保与容器同高 */
  width: 60%;
}

.icon-button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  height: 40px; /* 确保与搜索框同高 */
}
.icon-button .material-icons {
  font-size: 20px;
}

.loading-indicator {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #888;
}

.data-table {
  width: 90%;
  border-collapse: collapse;
}
.data-table th,
.data-table td {
  border: 1px solid #ccc;
  padding: 8px;
  text-align: center;
  vertical-align: middle; /* 垂直居中 */
  white-space: nowrap; /* 防止换行 */
  max-width: 120px; /* 设置每列的最大宽度 */
  overflow: hidden; /* 隐藏溢出的内容 */
  text-overflow: ellipsis; /* 使用省略号表示溢出的内容 */
}

.no-results {
  margin-top: 10px;
  text-align: center;
}

.options-popup {
  display: flex;
  flex-direction: column; /* 垂直排列内容 */
  align-items: center;    /* 水平居中 */
  justify-content: center; /* 垂直居中（如果需要） */
  text-align: center;
  padding: 8px;           /* 添加内边距 */
}

.option-item {
  display: flex;
  align-items: center; /* 水平居中图标和文本 */
  justify-content: center;
  cursor: pointer;
  width: 24px;
  padding: 20% 35%;
}
